@extends('mobile.layout1')
@section('title','绑定手机')
    @section('body')
<body id="login" ontouchstart="">
<header class="ui-header ui-header-stable af-header">
    <ul class="ui-row-flex">
        <li class="ui-col ui-flex ui-flex-pack-start">
        </li>
        <li class="ui-col ui-flex ui-flex-pack-center">
            <h1>绑定手机</h1>
        </li>
        <li class="ui-col ui-flex ui-flex-pack-end">
            <a data-href="/"><i class="ui-icon-home"></i></a>
        </li>
    </ul>
</header>
@endsection
@section('content')
    <section class="ui-form-login">

            <div class="ui-form-item ui-form-item-r ui-border">
                <input id="phone" type="text" name="phone" data-reg="^1[3|4|5|6|7|8|9]\d{9}$" placeholder="请输入手机号码" required data-reg-msg="请输入正确的手机号码">
                <button type="button" class="J-countDown ui-border-l" data-time="60" onclick="sendMobile(this)"   style="color: #f60;">
                    获取验证码
                </button>
            </div>


            <div class="ui-form-item ui-form-item-pure ui-border">
                <input type="text" id="mescode" name="mesCode" class="form-control" placeholder="请输入短信验证码" required>
                {{--<a href="#" class="ui-icon-close"></a>--}}

            </div>


            <button class="ui-btn-lg ui-btn-primary btn btn-block btn-yellow" type="button" onclick="bindMobile()">绑定手机</button>
            <div style="margin-top: 15px">
              <p>  1、为了保障您的推广收益安全，请您绑定手机号码。</p>
                <p>  2、该号码将是进行此账号的身份识别依据。</p>
                <p>   3、我们将保护您的个人隐私不外泄</p>

            </div>


    </section>


@endsection
@section('js')
    <script>
        var countdown=60;
        function settime(obj){
            if (countdown == 0) {
                obj.attr("disabled",false);
                obj.text("获取验证码");
                countdown = 60;
            } else {
                obj.attr("disabled", true);
                obj.text("重新发送(" + countdown + ")");
                countdown--;
                setTimeout(function() {
                    settime(obj)
                },1000)
            }

        }

        function sendMobile(n){
            var chkCode=$("#picCode").val();
            var phone=$("#phone").val();
            var disable=false;
            if($("#picCode").val()==''){
                layer.open({
                    content: '验证码不能为空',
                    time: 2
                    ,skin: 'msg'
                });
                return ;
            }
            if($("#phone").val()==''){
                layer.open({
                    content: '请输入手机号',
                    time: 2
                    ,skin: 'msg'
                });
                return ;
            }
            if(disable==true){
                return ;
            }
           var index= layer.open({
                type: 2
                ,content: '提交中'
            });
            disable=true;
            $.post('/user/sms',{chkCode:chkCode,phone:phone},function(data){
                        var obj = $(n);
                        settime(obj);
                        layer.close(index);
                        layer.open({
                            content: data.message,
                            time: 2
                            ,skin: 'msg'
                        });
                        disable=false;


            });
        }
        function bindMobile(){
            var phone=$("#phone").val();
            var mescode=$("#mescode").val();

            var index=  layer.open({
                type: 2
                ,content: '提交中'
            });
            $.post('/user/bindMobile',{phone:phone,mescode:mescode},function(data){
                if(data.code==0){
                    layer.open({
                        content: data.message,
                        time: 2
                        ,skin: 'msg'
                    });
                    layer.close(index);
                }else{
                    layer.open({
                            content: data.message,
                        time:2,
                        skin:'msg'
                        }
                    );
                    layer.close(index);
                    window.location.href='/';
                }
            });
        }
    </script>

    @endsection
</body>
</html>